<template>
  <div>
      输入空格变SPACE
      <input type="text" @keydown.space="fun1()">
      <div>{{space}}</div>
      输入ctrl变K
      <input type="text" @keydown.ctrl="fun2()">
      <div>{{A}}</div>
      输入哪个显示哪个（$event）
      <input type="text" @keydown="fun3($event)">
      <div>输入的值-----{{B}}</div>
      <div>输入的值的编码-----{{C}}</div>
  </div>
</template>

<script>
export default {
    data(){
        return{
            space:"空格",
            A:"A",
            B:"B",
            C:"C"
        }
    },
    methods:{
        fun1(){
            this.space="SPACE"
        },
        fun2(){
            this.A="K"
        },
        fun3(i){
            this.B=i.key
            this.C=i.keyCode
            console.log(i);
        }
    }
}
</script>

<style>

</style>